<template>
  <view class="page-container">
    <GlobalTopBar ref="topBarRef" class="topbars">
      <template #title><text>在线报修</text></template>
    </GlobalTopBar>

    <view class="page_content">
      <image
        class="online_1_img"
        :src="`${store.imgDomain}online_1.jpg`"
        mode="widthFix"
      />
      <button open-type="contact" class="ke_btn">
        <image
          class="online_2_img"
          :src="`${store.imgDomain}online_2.jpg`"
          mode="widthFix"
        />
      </button>
      <tabBar :current-index="2" :tab-list="store.tabList"></tabBar>
    </view>
  </view>
</template>

<script setup>
import { ref } from 'vue';
import tabBar from '@/components/tabBar.vue';
import { useCounterStore } from '@/store';

const store = useCounterStore();
const title = ref('在线报修');
</script>

<style>
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
}

.text-area {
  display: flex;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: #8f8f94;
}
.online_1_img {
  width: 750rpx;
}
.online_2_img {
  width: 548rpx;
  height: 70rpx;
}
.ke_btn {
  margin-top: 60rpx;
  border-radius: 35rpx;
  padding: 0;
  width: 548rpx;
  height: 70rpx;
  background-color: transparent;
  border: none;
  outline: none;
}
</style>
